import { createContext, memo, useContext } from "react";

const countContext = createContext(111);

function App() {
  return (
    <>
      <countContext.Provider value={222}>
        {/* <Bbb /> */}
        <Bbb count={234}/>
      </countContext.Provider>
    </>
  );
}
// function Bbb() {
//   return (
//     <div>
//       <Ccc />
//     </div>
//   );
// }
interface BbbProps {
  count: number;
}
function Bbb(props: BbbProps) {
  console.log("bbb render");

  return <div>{props.count}</div>;
}
const MemoBbb = memo<BbbProps>(Bbb);
function Ccc() {
  const count = useContext<number>(countContext);
  return <h2>context的值为{count}</h2>;
}

export default App;
